<template>
  <!--付款-->
  <div>
    <!--全部-->
    <div>
      <span style="padding: 0 10px"><i class="font-14 el-icon-s-open"></i></span>
      <el-select v-model="filterValue" value-key="value" @change="initData(currPage,pageSize,filterValue,content)" placeholder="全部数据" style="width: 120px">
          <el-option v-for="item in filterOptions" :key="item.value" :label="item.label" :value="item">
          </el-option>
      </el-select>
      <span style="padding: 0 10px 0 30px"><i class="fn el-icon-message-solid"></i></span>
      <el-input v-model="content" clearable placeholder="请输入内容" style="width: 150px"></el-input>
      <el-select v-model="vagueValue"  placeholder="付款日期" style="width: 120px">
        <el-option v-for="item in vagueOptions" :key="item.value"
                   :label="item.label" :value="item.value">
        </el-option>
      </el-select>
      <el-button @click="initData(currPage,pageSize,filterValue,content)" icon="el-icon-search" size="small" circle></el-button>
    </div>
    <!--新建付款记录-->
    <el-row style="margin-top: 15px;overflow: hidden;">
      <el-col :span="12" class="col-sm-6 text-left" style="margin-bottom: 20px">
        <span>付款记录</span>
        <small class="text-muted font-13">共{{totalSize}}条</small>
      </el-col>
      <el-col :span="12" class="col-sm-6 text-right">
        <el-button type="text" @click="newPaymentRecords">
          <el-button size="small" icon="el-icon-circle-plus-outline">新建</el-button>
        </el-button>
      </el-col>
      <!--付款记录dialog-->
      <el-dialog title="付款记录" :visible.sync="dialogFormVisible" width="60%" style="color: #333333"
                  @close="closeDialog">
        <el-form :model="paymentRecords" ref="payRecords" label-width="100px" :rules="rules">
          <hr style="margin-bottom: 15px">
          <el-row>
            <el-col>
              <el-form-item label="采购单:">
                <el-select v-model="paymentRecords.purchaseByPurchaseId" value-key="purchaseId" placeholder="未选" style="width: 91%">
                  <el-option v-for="item in purchaseList" :key="item.purchaseId" :label="item.purchaseTheme" :value="item">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="期次:">
                <el-select v-model="paymentRecords.paymentRecordsPeriods" placeholder="未选"  style="width: 79%">
                  <el-option v-for="item in qcOptions" :key="item.value" :label="item.label" :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="付款日期:" prop="paymentRecordsDate">
                <el-date-picker v-model="paymentRecords.paymentRecordsDate" type="date" placeholder="选择日期" style="width: 79%"></el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="金额:" prop="paymentRecordsAmount">
                <el-input v-model.number="paymentRecords.paymentRecordsAmount" style="width: 79%"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="付款方式:" prop="paymentRecordsPayStyle">
                <el-select v-model="paymentRecords.paymentRecordsPayStyle" placeholder="未选"  style="width: 79%">
                  <el-option v-for="item in fsOptions" :key="item.value" :label="item.label" :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否收票:">
                <el-radio-group v-model="paymentRecords.paymentRecordsWhetherTicket">
                  <el-radio :label="1">未收</el-radio>
                  <el-radio :label="2">已收</el-radio>
                  <el-radio :label="3">无需发票</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="客户:" prop="customerByCustomerId.customerName">
                <el-input :disabled="true" v-model="paymentRecords.customerByCustomerId.customerName" style="width: 79%"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="对应对货单:" >
                <el-input :disabled="true" style="width: 79%"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="经手人:" prop="employeeByEmpId.empName">
                <el-input :disabled="true" v-model="paymentRecords.employeeByEmpId.empName" style="width: 79%"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="分类:" >
                <el-select v-model="paymentRecords.paymentRecordsClassify" placeholder="未选"  style="width: 79%">
                  <el-option v-for="item in flOptions" :key="item.value" :label="item.label" :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col>
              <el-form-item label="备注:">
                <el-input v-model="paymentRecords.paymentRecordsNote" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" style="width: 91%"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12" :offset="6">
              <el-form-item>
                <el-button @click="addPayRecords" type="primary">保存</el-button>
                <el-button @click="dialogFormVisible = false">取消</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-dialog>
    </el-row>
    <!--付款记录表格-->
    <el-table ref="multipleTable" :data="paymentRecordsList" tooltip-effect="dark" id="outTable"
              style="width: 100%" :header-cell-style="rowClass" @selection-change="handleSelectionChange" border>
      <el-table-column type="selection" ></el-table-column>
      <el-table-column prop="paymentRecordsId" label="ID" sortable width="60"></el-table-column>
      <el-table-column label="付款金额" sortable width="110">
        <template slot-scope="scope">
          <div class="cursor" @click="handleEdit(scope.row)">
              <i class="el-icon-caret-right"></i>￥{{scope.row.paymentRecordsAmount}}
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="paymentRecordsPeriods" label="期次" sortable width="80"></el-table-column>
      <el-table-column prop="paymentRecordsDate" label="付款日期" sortable width="110">
        <template slot-scope="scope">
          <span>{{scope.row.paymentRecordsDate | formatDateJudge}}</span>
        </template>
      </el-table-column>
      <el-table-column label="是否收票" width="80">
        <template slot-scope="scope">
          <span v-if="scope.row.paymentRecordsWhetherTicket === 1">未收</span>
          <span v-if="scope.row.paymentRecordsWhetherTicket === 2">已收</span>
          <span v-if="scope.row.paymentRecordsWhetherTicket === 3">无需发票</span>
        </template>
      </el-table-column>
      <el-table-column label="分类" width="80">
        <template slot-scope="scope">
          <span v-if="scope.row.paymentRecordsClassify === 1">{{flOptions[0].label}}</span>
          <span v-if="scope.row.paymentRecordsClassify === 2">{{flOptions[1].label}}</span>
          <span v-if="scope.row.paymentRecordsClassify === 3">{{flOptions[2].label}}</span>
        </template>
      </el-table-column>
      <el-table-column label="供应商(客户)" >
        <template slot-scope="scope">
          <div style="color: #333333">
            <span>{{scope.row.customerByCustomerId.customerName}}</span>
            <el-tooltip class="item" effect="dark" content="打开详细页面" placement="bottom">
              <router-link :to="{path:'/customerview',query: {customerId: scope.row.customerByCustomerId.customerId}}">
                <span style="color: #333333"><i class="el-icon-s-cooperation"></i></span>
              </router-link>
            </el-tooltip>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="采购单" >
        <template slot-scope="scope">
          <span>{{scope.row.purchaseByPurchaseId.purchaseTheme}}</span>
          <router-link :to="{path:'/purchaseview',query: {purId: scope.row.purchaseByPurchaseId.purchaseId}}">
            <span style="color: #333333"><i class="el-icon-s-cooperation"></i></span>
          </router-link>
        </template>
      </el-table-column>
      <el-table-column prop="employeeByEmpId.empName" label="经手人" ></el-table-column>
      <el-table-column label="付款计划ID" width="100">
        <template slot-scope="scope">
          <div style="color: #333333">
            <span>{{scope.row.paymentPlanByPaymentPlanId.paymentPlanId}}</span>
            <el-tooltip class="item" effect="dark" content="打开详细页面" placement="bottom">
              <router-link :to="{path:'/plannedpaymentview',query: {payId: scope.row.paymentPlanByPaymentPlanId.paymentPlanId}}">
                <span style="color: #333333">
                  <i class="el-icon-s-cooperation"></i>
                </span>
              </router-link>
            </el-tooltip>
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="" label="操作" width="135px">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.row)"
                     icon="el-icon-edit" type="primary" circle style="margin-left: 10px"></el-button>
          <el-button size="mini" @click="handleDelete(scope.row)"
                     icon="el-icon-delete" type="danger" circle></el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <el-row style="margin-top:10px">
      <el-col :span="8">
        <el-tooltip class="item" effect="dark" content="删除" placement="bottom">
          <el-button style="padding: 12px 12px" icon="el-icon-delete" @click="handleDeleteMany" type="danger"></el-button>
        </el-tooltip>
      </el-col>
      <el-col :span="13">
        <el-pagination layout="sizes,prev,pager, next, jumper" :total="totalSize" @current-change="changePage"
                       :current-page.sync="currPage" :page-size="pageSize" :page-sizes="pageSizes" @size-change="changeSize"></el-pagination>
      </el-col>
      <el-col :span="3">
        <el-tooltip class="item" effect="dark" content="打印列表" placement="bottom">
          <el-button @click="handleWindowPrint('#outTable', '列表打印')" style="padding: 12px 12px" type="info" plain  icon="el-icon-printer"></el-button>
        </el-tooltip>
        <el-tooltip class="item" effect="dark" content="批量导出Excel格式数据" placement="bottom">
          <el-button @click="batchExportExcel" style="padding: 12px 12px" type="info" plain  icon="el-icon-document-copy"></el-button>
        </el-tooltip>
        <el-tooltip class="item" effect="dark" content="导出Excel格式数据" placement="bottom">
          <el-button @click="exportExcel" style="padding: 12px 12px" type="info" plain  icon="el-icon-document-remove"></el-button>
        </el-tooltip>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import {formatTimeToStr} from "../assets/format";
  import XLSX from "xlsx";
  import FileSaver from "file-saver";

  export default {
  data () {
    return {
      emp: {},
      dialogFormVisible: false,
      paymentRecordsList: [],
      purchaseList: [], // 采购集合分页
      customerList: [], // 员工客户集合
      paymentRecords:{
        paymentRecordsId:0,
        paymentRecordsPeriods:'',
        paymentRecordsDate:'',
        paymentRecordsAmount:'',
        paymentRecordsPayStyle:'',
        paymentRecordsWhetherTicket:'',
        paymentRecordsClassify:'',
        paymentRecordsNote:'',
        employeeByEmpId:'',
        customerByCustomerId:'',
        purchaseByPurchaseId:'',
        paymentPlanByPaymentPlanId:'',
        returnByReturnId:null
      },
      pageSize: 10, // 分页页大小
      pageSizes:[10,20,30],//页大小数组
      currPage: 1, // 当前页码，默认为1
      totalSize: 0, // 总记录数
      content: '',// input内容
      innerDialogEmp: false,// 内层dialog员工
      activeName: [],
      deptList:[],
      content: '',// input内容
      customerValue:'',// 模糊查询客户
      customerList2:[],// 模糊查询结果
      visible: false,// 模糊搜索结果
      mulSelection: [],
      rules: {
        paymentRecordsAmount: [
          { required: true, message: '必须填'},
          { type: 'number', message: '必须为数字'}
        ],
        'customerByCustomerId.customerName': [
          { required: true, message: '请选择客户', trigger: 'blur' }
        ],
        'employeeByEmpId.empName': [
          { required: true, message: '请选择负责人', trigger: 'blur' }
        ],
        purchaseByPurchaseId: [
          { required: true, message: '必须填', trigger: 'blur' }
        ],
        paymentRecordsDate: [
          { required: true, message: '必须填', trigger: 'blur' }
        ],
        paymentRecordsPayStyle: [
          { required: true, message: '必须填', trigger: 'blur' }
        ]
      },
      qcOptions: [{
        value: 1,
        label: '1'
      }, {
        value: 2,
        label: '2'
      }, {
        value: 3,
        label: '3'
      }, {
        value: 4,
        label: '4'
      }, {
        value: 5,
        label: '5'
      }, {
        value: 6,
        label: '6'
      },{
        value: 7,
        label: '7'
      }, {
        value: 8,
        label: '8'
      }, {
        value: 9,
        label: '9'
      }, {
        value: 10,
        label: '10'
      }, {
        value: 11,
        label: '11'
      }, {
        value: 12,
        label: '12'
      }],
      fsOptions: [{
        value: 1,
        label: '支票'
      }, {
        value: 2,
        label: '现金'
      }, {
        value: 3,
        label: '邮政付款'
      },{
        value: 4,
        label: '电汇'
      }, {
        value: 5,
        label: '网上银行'
      },{
        value: 6,
        label: '其他'
      }],
      flOptions: [{
        value: 1,
        label: '购货款'
      }, {
        value: 2,
        label: '转账'
      }, {
        value: 3,
        label: '抵债付款'
      }],
      filterOptions: [{
        value: 0,
        num: 0,
        label: '全部数据'
      },{
        value: 1,
        num: 1,
        label: '支票'
      }, {
        value: 2,
        num: 2,
        label: '现金'
      }, {
        value: 3,
        num: 3,
        label: '邮政付款'
      },{
        value: 4,
        num: 4,
        label: '电汇'
      }, {
        value: 5,
        num: 5,
        label: '网上银行'
      },{
        value: 6,
        num: 6,
        label: '其他'
      },{
        value: 7,
        num: 1,
        label: '购货款'
      }, {
        value: 8,
        num: 2,
        label: '转账'
      }, {
        value: 9,
        num: 3,
        label: '抵债付款'
      },{
        value: 10,
        num: 1,
        label: '未收发票'
      }, {
        value: 11,
        num: 2,
        label: '已收发票'
      }, {
        value: 12,
        num: 3,
        label: '无需发票'
      }],
      filterValue:{value:0,num:0},
      vagueOptions: [{
        value: 1,
        label: '付款日期'
      }],
      vagueValue: 1,
      selectList:[]
    }
  },
  methods: {
    // 查询当前员工
    loginEmp() {
      this.$axios.get('http://localhost:8088/emp')
        .then(v => {
          this.emp = v.data
        })
        .catch(function (v) {
        })
    },
    // 分页查询所有
    initData(currPage, pageSize,vague,content) {
      this.$axios.get('http://localhost:8088/pay-records-list', {
        params: {
          page: currPage,
          size: pageSize,
          value: vague.value,
          num:  vague.num,
          payDate: content
        }
      })
        .then(v => {
          this.paymentRecordsList = v.data.rows
          this.totalSize = v.data.total
        })
        .catch(function (v) {
        })
    },
    // 付款记录表格分页
    changePage(val) {
      this.initData(val, this.pageSize,this.vagueValue,this.content)
    },
    //改变页大小
    changeSize(val){
      this.pageSize = val
      this.currPage = 1
      this.initData(this.currPage,this.pageSize,this.filterValue,this.content)
    },
    // 查询所有采购
    findPurchaseList(cusId) {
      this.$axios.get('http://localhost:8088/pur-cus-list',{
        params:{
          cusId:cusId
        }
      })
        .then(v => {
          this.purchaseList = v.data
        })
        .catch(function (v) {
        })
    },
    // 修改数据回显
    handleEdit(val) {
      this.dialogFormVisible = true
      this.paymentRecords.paymentRecordsId = val.paymentRecordsId
      this.paymentRecords.paymentRecordsPeriods = val.paymentRecordsPeriods
      this.paymentRecords.paymentRecordsDate = val.paymentRecordsDate
      this.paymentRecords.paymentRecordsAmount = val.paymentRecordsAmount
      this.paymentRecords.paymentRecordsPayStyle = val.paymentRecordsPayStyle
      this.paymentRecords.paymentRecordsWhetherTicket = val.paymentRecordsWhetherTicket
      this.paymentRecords.paymentRecordsClassify = val.paymentRecordsClassify
      this.paymentRecords.paymentRecordsNote = val.paymentRecordsNote
      this.paymentRecords.customerByCustomerId = val.customerByCustomerId
      this.paymentRecords.employeeByEmpId = val.employeeByEmpId
      this.paymentRecords.purchaseByPurchaseId = val.purchaseByPurchaseId
      this.paymentRecords.paymentPlanByPaymentPlanId = val.paymentPlanByPaymentPlanId
      this.paymentRecords.returnByReturnId = val.returnByReturnId
      this.findPurchaseList(val.customerByCustomerId.customerId)
    },
    // 新增、修改
    addPayRecords() {
      this.$refs.payRecords.validate((valid) => {
        if (valid) {
          this.$axios.post('http://localhost:8088/save-pay-records',this.paymentRecords)
            .then(v => {
              this.initData(this.currPage,this.pageSize,this.filterValue,this.content)
              this.dialogFormVisible = false
              this.$message({
                message: '已保存',
                type: 'success'
              });
            })
            .catch(function (v) {
            })
        } else {
          console.log('error submit!!');
          return false;
        }
      })

    },
    // 关闭dialog事件
    closeDialog() {
      this.$refs.payRecords.resetFields()
      this.paymentRecords = {
        paymentRecordsId:0,
        paymentRecordsPeriods:'',
        paymentRecordsDate:'',
        paymentRecordsAmount:'',
        paymentRecordsPayStyle:'',
        paymentRecordsWhetherTicket:'',
        paymentRecordsClassify:'',
        paymentRecordsNote:'',
        employeeByEmpId:'',
        customerByCustomerId:'',
        purchaseByPurchaseId:'',
        paymentPlanByPaymentPlanId:'',
        returnByReturnId:null
      }

    },
    // 删除提示
    handleDelete(val) {
      this.$confirm('此操作将永久删除该付款记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.deletePay(val.paymentRecordsId)
        this.$message({
          type: 'success',
          message: '删除成功!'
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 批量删除提示
    handleDeleteMany() {
      this.$confirm('此操作将永久删除勾选付款记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.deleteAll()
        this.$message({
          type: 'success',
          message: '删除成功!'
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 获取批量删除对象集合
    handleSelectionChange(val) {
      this.mulSelection = val
    },
    // 删除axios
    deletePay(payId) {
      this.$axios.post('http://localhost:8088/delete-pay-records',
        this.qs.stringify({payId: payId}))
        .then(v => {
          this.initData(this.currPage,this.pageSize,this.filterValue,this.content)
        })
        .catch(function (v) {
        })
    },
    // 删除所有
    deleteAll() {
      this.mulSelection.forEach(row => {
        this.initData(this.currPage,this.pageSize,this.filterValue,this.content)
      })
    },
    // 新建付款记录提示
    newPaymentRecords(){
      this.$message('请先建立付款计划，审批后由该计划生成付款记录');
    },
    // pdf打印
    handleWindowPrint (ele, fileName) {
      document.body.innerHTML = document.querySelector(ele).outerHTML
      // 转异步 等待dom元素渲染（样式）完毕在打印
      setTimeout(() => {
        // 打印
        window.print()
        // 刷新页面
        window.location.reload()
      }, 20)
    },
    //导出excel
    exportExcel () {
      var xlsxParam = { raw: true };//转换成excel时，使用原始的格式
      var wb = XLSX.utils.table_to_book(document.querySelector("#outTable"),xlsxParam);
      var wbout = XLSX.write(wb, {
        bookType: "xlsx",
        bookSST: true,
        type: "array"
      });
      try {
        FileSaver.saveAs(
          new Blob([wbout], { type: "application/octet-stream;charset=utf-8" }),
          "付款记录导出.xlsx"
        );
      } catch (e) {
        if (typeof console !== "undefined") console.log(e, wbout);
      }
      return wbout;
    },
    //批量导出excel batchList
    batchExportExcel(){
      this.mulSelection.forEach((item,i)=>{
        this.$set(item,'paymentRecordsId',item.paymentRecordsId);
        this.$set(item,'paymentRecordsAmount','￥'+item.paymentRecordsAmount)
        this.$set(item,'paymentRecordsPeriods',item.paymentRecordsPeriods);
        this.$set(item,'paymentRecordsDate',item.paymentRecordsDate);
        if (item.paymentRecordsWhetherTicket === 1){
          this.$set(item,'paymentRecordsWhetherTicket','未收');
        }else if(item.paymentRecordsWhetherTicket === 2){
          this.$set(item,'paymentRecordsWhetherTicket','已收');
        }else if(item.paymentRecordsWhetherTicket === 3){
          this.$set(item,'paymentRecordsWhetherTicket','无需发票');
        }
        if(item.paymentRecordsClassify !== null){
          this.$set(item,'paymentRecordsClassify',this.flOptions[item.paymentRecordsClassify - 1].label);
        }
        this.$set(item,'customerName',item.customerByCustomerId.customerName);
        this.$set(item,'purchaseTheme',item.purchaseByPurchaseId.purchaseTheme)
        this.$set(item,'empName',item.employeeByEmpId.empName);
        this.$set(item,'paymentPlanId',item.paymentPlanByPaymentPlanId.paymentPlanId);
        this.selectList.splice(i,0,item);
      })
      //excel数据导出
      require.ensure([], () => {
        const {
          export_json_to_excel
        } = require('../js/Export2Excel');
        const tHeader = ['ID','付款金额','期次','付款日期','是否收票','分类','供应商(客户)','采购单','经手人','付款计划ID'];
        const filterVal = ['paymentRecordsId','paymentRecordsAmount','paymentRecordsPeriods','paymentRecordsDate','paymentRecordsWhetherTicket','paymentRecordsClassify',
          'customerName','purchaseTheme','empName','paymentPlanId'];
        const list = this.selectList;
        const data = this.formatJson(filterVal, list);
        export_json_to_excel(tHeader, data, '付款记录批量导出');
      })
      this.initData(this.currPage,this.pageSize,this.filterValue,this.content)
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    },
    // 表头靠左样式
    rowClass(){
      return "text-align:left"
    }
  },
  created() {
    this.loginEmp()
    this.initData(this.currPage,this.pageSize,this.filterValue,this.content)
  },
    filters: {
      formatDateJudge: function(time) {
        if(time != null && time != "")
        {
          let date = new Date(time);
          let currentDate = new Date()
          let seperator1 = "-";
          let month = currentDate.getMonth() + 1<10? "0"+(currentDate.getMonth() + 1):currentDate.getMonth() + 1;
          let strDate = currentDate.getDate()<10? "0" + currentDate.getDate():currentDate.getDate();
          let today = currentDate.getFullYear() + seperator1  + month  + seperator1  + strDate
          let todayTime = new Date(today)
          let yesterday = todayTime.setDate(todayTime.getDate() - 1)
          let beforeYesterday = todayTime.setDate(todayTime.getDate() - 1)
          let tomorrow = todayTime.setDate(todayTime.getDate() + 3)
          let afterTomorrow = todayTime.setDate(todayTime.getDate() + 1)
          todayTime.setDate(todayTime.getDate() - 2)
          if (date.getTime() === todayTime.getTime()){
            return '今天'
          }else if (date.getTime() ===  yesterday){
            return '昨天'
          }else if (date.getTime() ===  beforeYesterday){
            return '前天'
          }else if (date.getTime() ===  tomorrow){
            return '明天'
          }else if (date.getTime() ===  afterTomorrow){
            return '后天'
          }else {
            return time
          }
        }else{
          return "";
        }
      }
    }
  }
</script>

<style>

</style>
